<template>
  <div class="main">
    <el-container class="main-container">
      <el-aside width="200px" class="main-container-aside">
        <!-- <div class="main-container-aside-img">
          <img src="@/assets/img/logo.jpg" alt="">
        </div> -->
        <mainMenu></mainMenu>
      </el-aside>
      <el-container>
        <el-header>
          <mainMenuHeader></mainMenuHeader>
        </el-header>
        <el-main>
          <router-vieww></router-vieww>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script setup lang="ts">
import mainMenu from './cpns/mainMenu.vue'
import mainMenuHeader from './cpns/mainMenuHeader.vue'

</script>

<style lang="scss" scoped>

$asideBackGroundColor: #000;

.main{
  height: 100%;
  &-container{
    height: 100%;
    &-aside{
      background-color: $asideBackGroundColor;
      &::-webkit-scrollbar{
        display:none;
      }
      &-img{
        width: 100%;
        img{
          width: 100%;
        }
      }
    }
  }
}
</style>
